{include file="public/head"/}
<div class="container-fluid" id="main">
    <div class="row clearfix">
        <div class="col-md-12 column">
            <div class="alert alert-dismissable alert-info">
                <button type="button" class="close">×</button>
                <p></p>
        	</div>
        </div>
    </div>
   
   
    <div class="ntDesktop">
        <div class="ntDesktop-head">{:strtoupper(lang("list_of_purchase_contract_terms"))}</div>

        <div class="row" style="padding-top:0px">
            <div class="col-md-6">
                <ul class="nav nav-tabs">
                    <li class="active" @click="getList('all')">
                        <a href="#all" data-toggle="tab" >
                            {:strtoupper(lang('all'))} <span class="label label-info"></span>
                        </a>
                    </li>
                    <li @click="getList('general_terms')">
                        <a href="#general_terms" data-toggle="tab">
                            {:strtoupper(lang('general_terms'))} <span class="label label-info"></span>
                        </a>
                    </li>
                    <li @click="getList('delivery_terms')">
                        <a href="#delivery_terms" data-toggle="tab"> 
                            {:strtoupper(lang('delivery_terms'))} <span class="label label-warning" ></span>
                        </a>
                    </li>
                    <li @click="getList('payment_terms')">
                        <a href="#payment_terms" data-toggle="tab">
                            {:strtoupper(lang('payment_terms'))} <span class="label label-default" ></span>
                        </a>
                    </li>
                    <li @click="getList('after_sales_terms')">
                        <a href="#after_sales_terms" data-toggle="tab">
                            {:strtoupper(lang('after_sales_terms'))} <span class="label label-danger" ></span>
                        </a>
                    </li>
                </ul>
            </div>
        </div>

        <div class="col-md-12 column text-right"> 
            <div>
                <a href="{:url('buyterms/addTerms')}" class='btn btn-primary' data-toggle="modal" data-target="#terms_editModal" stytle="margin-right:20px" v-if="auth_ids.indexOf(209) != -1">
                    <span class="glyphicon glyphicon-plus"></span> {:strtoupper(lang("add_purchase_contract_terms"))}
                </a>
            </div>
        </div>

   
        <div class="row clearfix">
            <div class="col-md-12 column">
                <table class="table table-striped table-hover ntTable" v-cloak>
                    <thead>
                        <tr>
                            <th style="text-align:center">No.</th>
                            <th  class="sorting" width="7%"  @click="clickSort('type')"> {:strtoupper(lang("category"))} </th>
                            <th > {:strtoupper(lang('article_content'))} </th>
                            <th class="sorting" width="5%" @click="clickSort('is_must')"> {:strtoupper(lang("It's_necessary_or_not"))} </th>
                            <th class="sorting" width="5%" @click="clickSort('drank')"> {:strtoupper(lang('classify'))} </th>
                            <th class="sorting" @click="clickSort('update_at')"> {:strtoupper(lang('edit'))} </th>
                            <th width="10%"> {:strtoupper(lang('operate'))} </th>
                        </tr>
                    </thead>
                    <tbody>
                        <tr v-for="(item,index) in listdata">
                            <td align="center">{{item.id}}</td>
                            <td> {{item.term_name}}</td>
                            <td> {{item.content}} </td>
                            <td> {{item.must}} </td>
                            <td> {{item.drank}} </td>
                            <td> {{item.create_name}}<br /><small>{{item.created_time}} </small></td>
                            <td class="text-right">
                                <div>
                                    <a :href="'/admin/buyterms/editTerms?request=edit&id='+item.id" class='btn btn-sm btn-primary' data-toggle="modal" data-target="#terms_editModal" v-if="auth_ids.indexOf(210) != -1">
                                        <span class="glyphicon glyphicon-pencil"></span> {:strtoupper(lang('edit'))}</a>
                                    <a href="#" class='btn btn-sm btn-default option-del' @click="requestDel(item.id)" v-if="auth_ids.indexOf(211) != -1">
                                        <span class="glyphicon glyphicon-trash"></span>{:strtoupper(lang('delete'))}</a>
                                </div>
                            </td>
                        </tr>
                    </tbody>
                </table>
            </div>

            <!--分页-->
            <ul class="pagination" id="pagination" v-show="listdata.length!=0"></ul>
        </div>
	</div>
</div>



<div class="modal fade" id="terms_editModal"  aria-labelledby="ntModalLabel" aria-hidden="true"  data-backdrop="static" data-keyboard="false">
    <div class="modal-dialog modal-lg" >
        <div class="modal-content"  style="width:1000px">
            
        </div><!-- /.modal-content -->
    </div><!-- /.modal -->
</div>
<script type="text/javascript">
    $("#terms_editModal").on("hidden.bs.modal", function() {
        $(this).removeData("bs.modal");
        $(".modal-content").children().remove();
    });
</script>
<script src="/static/Admin/js/buyterms.js"></script>
{include file="public/foot"/}